
<style>
        .template-card {
            margin-bottom: 30px;
            text-align: center;
        }
        .template-img {
            width: 100%;
            height: auto;
            max-height: 200px;
            object-fit: cover;
        }
        .template-name {
            font-weight: bold;
            margin-top: 10px;
            font-size: 17px;
        }
        .card-text{
            font-size: 15px;
        }
    </style>
</head>

<body>
    <div class="container mt-5">
        <div class="row">
            <div class="col-12">
            <div class="alert alert-info" role="alert">自由选择模板，一切都是开始</div>
            </div>
        </div>
        <form  action="./call/addmoudle.php" method="post" name="edit-form" class="edit-form">
	  <div class="form-group" style="display: none;">
	<input class="form-control" type="text" id="web_site_html" name="html" value="" placeholder="data1">										               
  </div>		
  <div class="form-group" style="display: none;">
	<input class="form-control" readonly  type="text" id="web_site_answer" name="answer" value="" placeholder="data2">										               
  </div>
  <div class="form-group">
	<input class="form-control"   type="text" id="web_site_name" name="name" value="" placeholder="输入试卷名称">										               
  </div>
  <div class="form-group" style="display: none;">
	<input class="form-control" readonly  type="text" id="web_site_for" name="forid" value="" placeholder="data3">										               
  </div>									                          														             
	 <div style="display: none;" class="form-group">
	<button type="submit" id="addform" class="btn btn-primary m-r-5">添 加</button>
	 </div>													  				
	 </form>
        <div class="row">
           
        </div>
    </div>
    <script>
    document.getElementById("web_site_for").value = sessionStorage.getItem("exam_userid_forget");
 </script>
    <script>
        
        fetch('json/template.json').then(res => res.json()).then(templates => {
            let card = '';
            for (var key in templates) {
                if (templates.hasOwnProperty(key)) {
                    var template = templates[key];
                    const cardDiv = document.createElement('div');
                    cardDiv.className = 'col-sm-6 col-md-4';
            const cardInnerDiv = document.createElement('div');
            cardInnerDiv.className = 'card template-card';
        const img = document.createElement('img');
        if ((template.img).indexOf('::') === 0) {
            img.src = (template.img).split('::')[1];
        }else{
            img.src = `/ast/json_img/${template.img}.jpg`;
        }
        img.alt = '';
        img.className = 'card-img-top template-img';
        const cardBody = document.createElement('div');
        cardBody.className = 'card-body';
        const title = document.createElement('h5');
        title.className = 'card-title template-name';
        title.textContent = template.name;
        const description = document.createElement('p');
        description.className = 'card-text';
        description.textContent = template.say;
        const link = document.createElement('a');
        link.className = 'btn btn-primary select-template';
        link.textContent = '选择模板';
        link.onclick = function() {
            functoaddnew(template.content, template.answer);
        };
        cardInnerDiv.appendChild(img);
        cardBody.appendChild(title);
        cardBody.appendChild(description);
        cardInnerDiv.appendChild(cardBody);
        cardDiv.appendChild(cardInnerDiv);
        cardInnerDiv.appendChild(link);
        document.querySelector('.row').appendChild(cardDiv);

                }
}
        })
        function base64_decode_move(base64, encoding = 'utf-8') {
    const binaryString = atob(base64);
    const len = binaryString.length;
    const bytes = new Uint8Array(len);
    for (let i = 0; i < len; i++) {
        bytes[i] = binaryString.charCodeAt(i);
    }
    return new TextDecoder(encoding).decode(bytes);
}
        function functoaddnew(first,second) {
            if(document.getElementById('web_site_name').value === null || document.getElementById('web_site_name').value === '') {
                alert('请输入试卷名称');
                return false;
            }
            var new_content = base64_decode_move(first);
            var new_answer = base64_decode_move(second);
            document.getElementById("web_site_html").value = new_content;
            document.getElementById("web_site_answer").value = new_answer;
            document.forms['edit-form'].submit();
        }

    </script>

    